<template>
  <div class="more">
    <van-popover
      :actions="actions"
      position="top-start"
      placement="top-start"
      @select="onSelect"
    >
      <template #reference>
        <span>更多</span>
      </template>
    </van-popover>
  </div>
</template>

<script setup lang="ts">
import { computed } from 'vue'
import type { ConsultOrderItem } from '@/types/consult'
const props = defineProps<{
  orderItem: ConsultOrderItem
}>()
const emits = defineEmits<{
  (e: 'on-del', item: ConsultOrderItem): void
  (e: 'on-preview', id: string): void
}>()

const actions = computed(() => [
  { text: '查看处方', disabled: !props.orderItem.prescriptionId },
  { text: '删除订单' }
])

const onSelect = (action: any) => {
  if (action.text === '删除订单') {
    // 删除订单
    // handleDel(props.orderItem)
    emits('on-del', props.orderItem)
  } else {
    // 查看处方
    // previewPrescription(props.orderItem.prescriptionId!)
    emits('on-preview', props.orderItem.prescriptionId!)
  }
}
</script>

<style scoped>
.more {
  color: var(--cp-tag);
  flex: 1;
  font-size: 13px;
}
</style>
